Microsoft Technologies Advanced Data Binding Techniques (Data Template, CollectionView) গাইড ও নোট

Data Binding হল Windows Application Development-এর একটি শক্তিশালী বৈশিষ্ট্য, যা UI এবং ডেটার মধ্যে একটি সোজাসুজি সম্পর্ক তৈরি করে। এটি কোডের পরিমাণ কমাতে, UI কে ডাইনামিক ও রিয়েক্টিভ করতে সহায়তা করে। WPF, WinUI, এবং UWP-তে Advanced Data Binding Techniques ব্যবহার করে আরও উন্নত UI তৈরি করা যায়।

এই টিউটোরিয়ালে DataTemplate এবং CollectionView এর মাধ্যমে ডেটা বাইন্ডিং এর উন্নত টেকনিক্স আলোচনা করা হবে।

১. DataTemplate

DataTemplate একটি XAML ট্যাগ যা একটি কাস্টম UI তৈরি করতে ব্যবহৃত হয়, যা নির্দিষ্ট ডেটা টাইপ বা অবজেক্টের জন্য ব্যবহার করা হয়। DataTemplate ইউজারকে ডেটার ধরন অনুযায়ী কাস্টম UI প্রদর্শন করতে সাহায্য করে। এটি ItemsControl (যেমন ListBox, ComboBox, ListView) কন্ট্রোলের মধ্যে ডেটা প্রদর্শন করতে ব্যবহার করা হয়।

উদাহরণ: DataTemplate ব্যবহার করে ListBox-এর জন্য কাস্টম UI

<Window x:Class="AdvancedBindingExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Data Template Example" Height="350" Width="525">
    <Grid>
        <ListBox Name="listBox" HorizontalAlignment="Left" VerticalAlignment="Top" Width="200">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock Text="{Binding Name}" FontWeight="Bold"/>
                        <TextBlock Text="{Binding Age}"/>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</Window>

C# কোড:

using System.Collections.ObjectModel;
using System.Windows;

namespace AdvancedBindingExample
{
    public partial class MainWindow : Window
    {
        public ObservableCollection<Person> People { get; set; }

        public MainWindow()
        {
            InitializeComponent();
            People = new ObservableCollection<Person>
            {
                new Person { Name = "John", Age = 30 },
                new Person { Name = "Jane", Age = 25 },
                new Person { Name = "Bob", Age = 40 }
            };
            listBox.ItemsSource = People;
        }
    }

    public class Person
    {
        public string Name { get; set; }
        public int Age { get; set; }
    }
}

ব্যাখ্যা:

• DataTemplate ব্যবহার করা হয়েছে যাতে ListBox-এ প্রতিটি Person অবজেক্টের জন্য একটি কাস্টম UI (যেমন Name এবং Age) প্রদর্শিত হয়।
• ObservableCollection ডেটা পরিবর্তনের উপর UI আপডেট করার জন্য ব্যবহার করা হয়েছে।

২. CollectionView

CollectionView একটি Collection এর জন্য একটি ভিউ প্রদান করে এবং ডেটাকে সাজানোর, ফিল্টার করার এবং গ্রুপ করার সুবিধা দেয়। এটি সাধারণত ListView, DataGrid বা ListBox এর সঙ্গে ব্যবহৃত হয়।

উদাহরণ: CollectionView ব্যবহার করে ListBox-এ ডেটা ফিল্টার করা

<Window x:Class="AdvancedBindingExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="CollectionView Example" Height="350" Width="525">
    <Grid>
        <ListBox Name="listBox" HorizontalAlignment="Left" VerticalAlignment="Top" Width="200"/>
        <Button Content="Filter by Age > 30" HorizontalAlignment="Left" VerticalAlignment="Bottom" Width="200" Click="OnFilterButtonClick"/>
    </Grid>
</Window>

C# কোড:

using System.Collections.ObjectModel;
using System.Linq;
using System.Windows;
using System.ComponentModel;

namespace AdvancedBindingExample
{
    public partial class MainWindow : Window
    {
        public ObservableCollection<Person> People { get; set; }
        private ICollectionView _peopleView;

        public MainWindow()
        {
            InitializeComponent();
            People = new ObservableCollection<Person>
            {
                new Person { Name = "John", Age = 30 },
                new Person { Name = "Jane", Age = 25 },
                new Person { Name = "Bob", Age = 40 }
            };
            _peopleView = CollectionViewSource.GetDefaultView(People);
            listBox.ItemsSource = _peopleView;
        }

        private void OnFilterButtonClick(object sender, RoutedEventArgs e)
        {
            // Filter the collection by Age > 30
            _peopleView.Filter = item => ((Person)item).Age > 30;
        }
    }

    public class Person
    {
        public string Name { get; set; }
        public int Age { get; set; }
    }
}

ব্যাখ্যা:

• ICollectionView এবং CollectionViewSource.GetDefaultView ব্যবহার করে People এর একটি ভিউ তৈরি করা হয়েছে।
• Filter প্রপার্টি সেট করার মাধ্যমে, শুধুমাত্র বয়স ৩০-এর বেশি এমন Person অবজেক্টগুলো দেখানো হবে।

৩. Sorting and Grouping with CollectionView

CollectionView-এর মাধ্যমে ডেটা সোর্টিং এবং গ্রুপিং করা যায়। নিচে CollectionView ব্যবহার করে একটি ListBox-এ ডেটা গ্রুপিং এবং সorting এর উদাহরণ দেওয়া হলো।

উদাহরণ: CollectionView ব্যবহার করে ListBox-এ গ্রুপিং এবং সোর্টিং

<Window x:Class="AdvancedBindingExample.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Group and Sort Example" Height="350" Width="525">
    <Grid>
        <ListBox Name="listBox" HorizontalAlignment="Left" VerticalAlignment="Top" Width="200"/>
    </Grid>
</Window>

C# কোড:

using System.Collections.ObjectModel;
using System.Linq;
using System.Windows;
using System.ComponentModel;

namespace AdvancedBindingExample
{
    public partial class MainWindow : Window
    {
        public ObservableCollection<Person> People { get; set; }
        private ICollectionView _peopleView;

        public MainWindow()
        {
            InitializeComponent();
            People = new ObservableCollection<Person>
            {
                new Person { Name = "John", Age = 30 },
                new Person { Name = "Jane", Age = 25 },
                new Person { Name = "Bob", Age = 40 },
                new Person { Name = "Alice", Age = 30 }
            };
            _peopleView = CollectionViewSource.GetDefaultView(People);

            // Grouping by Age
            _peopleView.GroupDescriptions.Add(new PropertyGroupDescription("Age"));

            // Sorting by Name
            _peopleView.SortDescriptions.Add(new SortDescription("Name", ListSortDirection.Ascending));

            listBox.ItemsSource = _peopleView;
        }
    }

    public class Person
    {
        public string Name { get; set; }
        public int Age { get; set; }
    }
}

ব্যাখ্যা:

• GroupDescriptions: এটি ডেটাকে নির্দিষ্ট প্রপার্টির ভিত্তিতে গ্রুপ করতে ব্যবহার করা হয়। এখানে Age প্রপার্টি দিয়ে গ্রুপিং করা হয়েছে।
• SortDescriptions: এটি ডেটাকে একটি নির্দিষ্ট প্রপার্টির ভিত্তিতে সাজানোর জন্য ব্যবহৃত হয়। এখানে Name প্রপার্টি দিয়ে সোর্টিং করা হয়েছে।

৪. Binding Modes and Update Strategies

Data Binding-এ Binding Modes এবং Update Strategies বিভিন্ন উপায়ে ডেটা আপডেট করতে ব্যবহৃত হয়। এর মাধ্যমে আপনি নির্ধারণ করতে পারেন ডেটার পরিবর্তন কিভাবে UI-তে প্রদর্শিত হবে।

উদাহরণ: Binding Modes

<TextBox Text="{Binding Name, Mode=TwoWay}" />

• OneWay: UI থেকে ডেটায় পরিবর্তন হতে দেয় না, শুধুমাত্র ডেটা থেকে UI-তে পরিবর্তন হবে।
• TwoWay: ডেটা এবং UI দু’টি থেকেই পরিবর্তন হতে পারে।
• OneWayToSource: UI থেকে ডেটায় পরিবর্তন হবে, তবে ডেটা UI-তে প্রতিফলিত হবে না।
• OneTime: ডেটা একবারই UI-তে আপডেট হবে, এরপর আর কোনো পরিবর্তন হবে না।

উপসংহার

Advanced Data Binding Techniques যেমন DataTemplate, CollectionView, Sorting, Grouping, এবং Binding Modes Windows অ্যাপ্লিকেশনে ডেটা ম্যানিপুলেশনকে আরও শক্তিশালী এবং নমনীয় করে তোলে। DataTemplate কাস্টম UI তৈরি করতে সাহায্য করে, CollectionView ডেটাকে সাজানো এবং ফিল্টার করার সুবিধা দেয়, এবং Binding Modes আপনাকে ডেটার আপডেট পদ্ধতি নিয়ন্ত্রণ করতে সহায়তা করে

।

এই টেকনিকগুলো ব্যবহার করে আপনি ডাইনামিক এবং ইন্টারঅ্যাকটিভ UI তৈরি করতে পারবেন, যা ব্যবহারকারীর জন্য আরও উন্নত অভিজ্ঞতা প্রদান করবে।